import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '../store'

import Home from "../components/main-components/Main.vue"
import Detail from "../components/detail-components/detail.vue"
import Category from "../components/category-components/category.vue"
import Publisher from "../components/publisher-components/publisher.vue"
import User from "../components/user-components/user.vue"
import UserCenter from "../components/user-center-components/UserCenter.vue"
import UserModifyInfo from "../components/user-center-components/UserModifyInfo.vue"
import UserInterest from "../components/user-center-components/UserInterest.vue"
import UserModifyPassword from "../components/user-center-components/UserModifyPassword.vue"
import UserModifyPhone from "../components/user-center-components/UserModifyPhone.vue"
import PublishNews from '@/components/publish-components/PublishNews.vue'

import {mapState, mapGetters, mapMutations, mapActions} from 'vuex'

Vue.use(VueRouter)

// 解决多次点击一个路由的错误
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}

const router = new VueRouter({
  routes: [
    {
      path: '/',
      component: Home
    },
    {
      path: '/home',
      component: Home
    },
    {
      path: '/detail/:news_id',
      name: 'detail',
      component: Detail,
      props($route){
        return {
          news_id: $route.params.news_id
        }
      }
    },
    {
      path: '/category/:selectedItem',
      name: 'category',
      component: Category,
      props($route){
        return {
          selectedItem: $route.params.selectedItem
        }
      }
    },
    {
      path: '/publisher/:publisherName',
      name: 'publisher',
      component: Publisher,
      props($route){
        console.log($route.params.publisherName);
        return {
          publisherName: $route.params.publisherName
        }
      }
    },
    {
      path: '/user',
      name: 'user',
      component: User
    },
    {
      path: '/userCenter',
      component: UserCenter,
      redirect: '/userCenter/userModifyInfo',
      children: [
        {
          path: 'userModifyInfo',
          component: UserModifyInfo
        },
        {
          path: 'userInterest',
          component: UserInterest
        },
        {
          path: 'userModifyPassword',
          component: UserModifyPassword
        },
        {
          path: 'userModifyPhone',
          component: UserModifyPhone
        }
      ]
    },
    {
      path: "/publish",
      name: "publish",
      component: PublishNews,
    }
  ]
})

// 挂载全局路由导航守卫
// 挂载全局路由导航守卫
router.beforeEach((to, from, next) => {
  store.dispatch('user/checkLoginStatus')
  next(); // 无论如何都继续导航
});

export default router

